import { ref } from 'vue';
import mcApi from 'mc-c2b2m-operator-api';
import { BasicColumn, FormSchema } from '@/components/Table';
import { BizMetaAttrTreeModel } from 'mc-c2b2m-operator-api/types/spu';

const { SysModule, SpuModule } = mcApi;
const { BizMetaArrApi } = SpuModule;
const { UploadApi } = SysModule;

export const tableColumns: BasicColumn[] = [
  { width: 120, title: '订单号', dataIndex: 'orderCode' },
  { title: '产品名称', dataIndex: 'spuName' },
  { title: '产品规格', dataIndex: 'spec', slots: { customRender: 'spec' } },
  { width: 120, title: '下单手机', dataIndex: 'orderPlacerUserPhone' },
  { title: '销售负责人', dataIndex: 'salesInChargeName' },
  { title: '状态', dataIndex: 'status', slots: { customRender: 'status' } },
  { title: '经办人', dataIndex: 'operatorName' },
  { title: '图纸', dataIndex: 'attachment', slots: { customRender: 'attachment' } },
  { width: 80, title: '异常', dataIndex: 'isAbnormal', slots: { customRender: 'isAbnormal' } },
  { title: '备注', dataIndex: 'orderRemark' },
];

const bizMetaAttrTree = ref<BizMetaAttrTreeModel[]>([]);
bizMetaAttrTree.value = (await BizMetaArrApi.getBizMetaAttrTree()) || [];

const getTreeSelectProps = (field: string, label: string): FormSchema => {
  return {
    label,
    field,
    colProps: { span: 6 },
    component: 'TreeSelect',
    componentProps: ({ formActionType }) => {
      return {
        multiple: false,
        showSearch: true,
        treeCheckable: false,
        treeCheckStrictly: true,
        treeDefaultExpandAll: true,
        treeNodeFilterProp: 'cnName',
        treeData: bizMetaAttrTree.value,
        fieldNames: {
          value: 'id',
          label: 'cnName',
          children: 'childBizMetaAttrList',
        },
        getPopupContainer: () => document.body,
        onChange: async (e: any) => {
          const { setFieldsValue } = formActionType;
          const length = e?.length || 0;
          if (!length) return;
          const target = e[length - 1] || [];
          await setFieldsValue({ [field]: target });
        },
      };
    },
  };
};
export const tableFormSchema: FormSchema[] = [
  {
    field: 'orderCode',
    label: '订单号',
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'orderPlacerUserPhone',
    label: '下单手机号',
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'spuName',
    label: '产品名称',
    component: 'Input',
    colProps: { span: 6 },
  },
  getTreeSelectProps('paperTypeBizMetaAttrId', '纸种'),
  getTreeSelectProps('gramWeightBizMetaAttrId', '克重'),
  getTreeSelectProps('surfaceBizMetaAttrId', '表面'),
  getTreeSelectProps('afterProcessBizMetaAttrId', '后工'),
];

// 上传文件表单配置
export const uploadFormSchema: FormSchema[] = [
  {
    field: 'id',
    label: 'id',
    ifShow: false,
    component: 'Input',
  },
  {
    required: true,
    label: '文件',
    component: 'Upload',
    field: 'url',
    componentProps: {
      maxNumber: 1,
      maxSize: 100,
      api: UploadApi.uploadFile,
    },
  },
];
